<template>
  <div>
    <el-dialog
      v-model="props.visible"
      title="选择待取版内容"
      width="80%"
      @close="handleCancel"
    >
      <el-form
        :model="queryParams"
        class="flex-box"
        ref="queryRef"
        :inline="true"
      >
        <div>
          <el-form-item label="生产单编码" prop="produceNo">
            <el-input
              v-model.trim="queryParams.produceNo"
              placeholder="请输入生产单编码"
              @keyup.enter="handleQuery"
            />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="Search" @click="handleQuery">
              搜索
            </el-button>
            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
          </el-form-item>
        </div>
        <el-button
          type="primary"
          plain
          @click="handleSubmit"
          :disabled="multiple"
        >
          确认
        </el-button>
      </el-form>
      <el-row :gutter="20" style="overflow: auto">
        <el-col :span="8">
          <!--  @selection-change="handleSelectionChange"-->
          <!--  -->

          <el-table
            v-loading="loading"
            :data="orderList"
            stripe
            border
            style="cursor: pointer"
            highlight-current-row
            @cell-click="handleClickRow"
          >
            <!-- <el-table-column type="selection" :reserve-selection="true" width="55" /> -->
            <el-table-column
              label="序号"
              width="55"
              type="index"
              align="center"
            />
            <el-table-column
              label="生产单编码"
              align="center"
              prop="produceNo"
            ></el-table-column>
            <el-table-column
              label="出版编码"
              align="center"
              prop="pubNo"
            ></el-table-column>
            <el-table-column label="类型" align="center" prop="type">
              <template v-slot="{ row }">
                <el-tag :type="row.type == 1 ? 'success' : ''" effect="dark">
                  {{ row.type == 1 ? "封面" : "内文" }}
                </el-tag>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
        <el-col :span="16">
          <el-table
            ref="orderListTable"
            v-loading="loadingInfo"
            :data="printList"
            row-key="printId"
            @selection-change="handleSelectionChange"
            stripe
            border
            style="cursor: pointer"
          >
            <el-table-column
              type="selection"
              :reserve-selection="true"
              width="55"
            />
            <el-table-column
              label="印刷序列号"
              min-width="120"
              prop="producePieceNo"
              align="center"
            ></el-table-column>
            <el-table-column
              label="品种"
              prop="breed"
              min-width="160"
              align="center"
            >
            </el-table-column>
            <el-table-column
              label="印数"
              min-width="160"
              prop="printAmount"
              align="center"
            >
         
            </el-table-column>
            <!-- <el-table-column
              label="印色"
              width="120"
              prop="printColour"
              align="center"
            >
              <template #default="scope">
                <dict-tag
                  :options="ems_order_print_color"
                  :value="scope.row.printColour"
                />
              </template>
            </el-table-column> -->
            <!-- <el-table-column
              label="版材数量"
              width="120"
              prop="sheetAmount"
              align="center"
            ></el-table-column>
            <el-table-column
              label="版材尺寸"
              prop="sheetSize"
              width="120"
              align="center"
            >
              <template #default="scope">
                <dict-tag
                  :options="ems_machine_info_size"
                  :value="scope.row.sheetSize"
                />
              </template>
            </el-table-column> -->
          </el-table>
        </el-col>
      </el-row>
      <div class="footer">
        <pagination
          v-show="total > 0"
          :total="total"
          v-model:page="queryParams.pageNum"
          v-model:limit="queryParams.pageSize"
          @pagination="getList"
        />
      </div>
    </el-dialog>
  </div>
</template>

<script setup>
import { getTakeStay , } from "@/api/production/waitTakeVersion.js";
import { getProduceById, leftListZhi ,taskMachine} from "@/api/production/cover";
const emit = defineEmits(["changeUpdate", "cancel"]);
import useUserStore from '@/store/modules/user'

const { proxy } = getCurrentInstance();
const {
  ems_order_make_up_fm,
  ems_machine_info_size,
  ems_order_make_up,
  ems_order_print_color,
  ems_order_breed_type,
} = proxy.useDict(
  "ems_order_breed_type",
  "ems_machine_info_size",
  "ems_order_make_up",
  "ems_order_print_color",
  "ems_order_make_up_fm"
);

const props = defineProps({
  visible: {
    type: Boolean,
    default: false,
  },
  orderSelectList: {
    type: Array,
    default: () => {
      [];
    },
  },
  machineId: {
    type: String,
    default: "",
  },
});

const orderRef = ref(null);
const orderList = ref([]);
const printList = ref([]);
const multiple = ref(true);
const selectRow = ref([]);
const loading = ref(false);
const loadingInfo = ref(false);
const orderListTable = ref(null);
const isMake = ref("");
const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
});
watch(
  () => props.visible,
  (val) => {
    if (val) {
      handleQuery();
      // nextTick(() => {
      //   orderListTable.value.clearSelection();
      //   if (props.orderSelectList.length > 0) {
      //     props.orderSelectList.forEach((item) => {
      //       orderListTable.value.toggleRowSelection(item, true);
      //     });
      //   }
      // });
    }
  }
);
const total = ref(0);
// 选中订单
const handleClickRow = (row) => {
  handleClick(row).then((res) => {
    printList.value = res;
  });
};

const printColorToLable = (row) => {
  const resp = ems_order_print_color.value.filter((item) => item.value == row);
  return eval(resp[0].label);
};
const handleClick = (row) => {
  loadingInfo.value = true;
    getTakeStay({ produceId: row.produceId,machineId:props.machineId  }).then((res) => {
      res.rows.forEach(item=>{
        item.produceNo =row.produceNo
        item.printProduceNo =item.producePieceNo
        item.producePrintId =item.printId
        delete item.createTime
      })
      printList.value = res.rows
      loadingInfo.value = false;
    });
 
};

// 选中
const handleSelectionChange = (row) => {
  selectRow.value = row;
  multiple.value = !row.length;
};
const handleSubmit = () => {
  // handleAllClicks()
  console.log(selectRow.value);
  emit("changeUpdate", selectRow.value);
};
const handleCancel = () => {
  orderListTable.value.clearSelection()
  printList.value = [];
  proxy.resetForm("queryRef");
  emit("cancel");
};
const getList = async () => {
  loading.value = true;
  const res = await taskMachine({...queryParams.value,machineId:props.machineId});
  if (res.rows.length > 0) {
    orderListTable.value.setCurrentRow(res.rows[0]);
  } 
  loading.value = false;
  orderList.value = res.rows;
  if (orderList.value.length) {
    handleClick(orderList.value[0])
  } else {
    printList.value = [];
  }
  total.value = res.total;
};
// 搜索
const handleQuery = () => {
  queryParams.value.pageNum = 1;
  getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
  proxy.resetForm("queryRef");
  handleQuery();
};

// getList()
</script>

<style lang="scss" scoped></style>
